{% extends 'base-left.html' %}
{% load staticfiles %}

{% block css %}
    <link rel="stylesheet" href="{% static 'plugins/datatables/jquery.dataTables.min.css' %}">
    <link rel="stylesheet" href="{% static 'js/plugins/layer/skin/layer.css' %}">
    <link rel="stylesheet" href="{% static 'plugins/select2/select2.min.css' %}">
{% endblock %}


{% block content %}
    <section class="content">
        <div id="devlist">
            <div class="box box-primary" id="liebiao">
                <div class="box-header">
                    <div class="btn-group pull-left">
                        <button type="button" id="btnRefresh" class="btn btn-default">
                            <i class="glyphicon glyphicon-repeat"></i>刷新
                        </button>
                    </div>

                    <div class="btn-group pull-left">&nbsp</div>

                    <div class="btn-group pull-left">
                        <button type="button" id="btnCreate" class="btn btn-default">
                            <i class="glyphicon glyphicon-plus"></i>新增
                        </button>
                    </div>

                    <div class="btn-group pull-left">&nbsp</div>

                    <div class="btn-group pull-left">
                        <button type="button" id="btnDelete" class="btn btn-default">
                            <i class="glyphicon glyphicon-trash"></i>删除
                        </button>
                    </div>

                    <div class="pull-right">
                        <form class="form-inline" id="queryForm">
                            <div class="form-group searchArea margin-r-5 margin-top-5">
                                <label>字典分类</label>
                                <select class="form-control inputText select2" name="parent" id="parent">
                                    <option value="" style="text-align: center;">--所有--</option>
                                    {% for code in code_parent %}
                                    <option value="{{ code.key }}">{{ code.value }}</option>
                                    {% endfor %}
                                </select>
                            </div>
                        </form>
                    </div>
                </div>

                <div class="box-body">
                    <table id="btnList" class="display" cellspacing="0" width="100%">
                        <thead>
                            <tr valign="middle">
                                <th><input type="checkbox" id="checkAll"> </th>
                                <th>ID</th>
                                <th>KEY</th>
                                <th>VALUE</th>
                                <th>所属</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tbody></tbody>
                    </table>
                     <br><br>
                </div>
            </div>
        </div>
    </section>
{% endblock %}


{% block javascripts %}
    <script src="{% static 'plugins/datatables/jquery.dataTables.min.js' %}"></script>
    <script src="{% static 'plugins/datatables/dataTables.const.js' %}"></script>
    <script src="{% static 'js/plugins/layer/layer.js' %}"></script>
    <script src="{% static 'plugins/select2/select2.full.min.js' %}"></script>
    <script>
        $('#btnRefresh').click(function () {
            oDataTable.ajax.reload()
        });

        $("#btnCreate").click(function () {
           layer.open({
               type:2,
               title:'新增',
               shadeClose:false,
               maxmin:true,
               area:['800px','400px'],
               content:"{% url 'cmdb:portal-code-create' %}",
               end:function () {
                   oDataTable.ajax.reload();
               }
           });
        });
    </script>
{% endblock %}

